import React, {Component} from 'react'
import pageWithIntl from '../components/PageWithIntl'
import {bindActionCreators} from 'redux'
import {initStore} from '../store'
import Head from 'next/head'
import withRedux from 'next-redux-wrapper'
import Layout from '../layouts/pc'
import MLayout from '../layouts/mobile'

import dynamic from 'next/dynamic'
const ContactForms = dynamic(
    import ('../components/pc/ContactUs/list'));
const MContactForms = dynamic(
    import ('../components/mobile/ContactUs/list'));
// import ContactForms from '../components/pc/ContactUs/list'
// import MContactForms from '../components/mobile/ContactUs/list'
import SkinTag from '../components/skinTag'

import {newDevice, setMonitor} from '../actions/home/index'
import Wapper from '../components/wapper'
class Index extends Component {
    render() {
        const {device,skin} = this.props.home;
        const {headers} = this.props;
        if (device == 'pc') {
            return (
                <Layout>
                    <SkinTag  {...this.props.home}></SkinTag>
                    <Head>
                        <title>CONTACTS US-{headers.bottomInfo.name}</title>
                    </Head>
                    <div id="pContact">
                        <ContactForms/>
                    </div>
                </Layout>
            )
        } else if (device == 'mobile') {
            return (
                <MLayout>
                    <SkinTag  {...this.props.home}></SkinTag>
                    <Head>
                        <title>CONTACTS US-{headers.bottomInfo.name}</title>
                    </Head>
                    <div id="mContact">
                        <MContactForms  {...this.props.home} />
                    </div>
                </MLayout>
            )
        } else {
            return null
        }
    }
}
const mapStateToProps = ({
    home,
    headers
}) => ({
    home,
    headers
})
const mapDispatchToProps = (dispatch) => {
    return {
        newDevice: bindActionCreators(newDevice, dispatch),
        setMonitor: bindActionCreators(setMonitor, dispatch),
    }
};

export default withRedux(initStore, mapStateToProps, mapDispatchToProps)(pageWithIntl(Wapper(Index)))